<template>
	<view>		
		<uni-table style="margin: 10rpx;" ref="table" border stripe emptyText="暂无更多数据">
			<uni-tr>
				<uni-th v-for="(item, index) in fieldName" :key='index' align="center">{{item.name}}</uni-th>
				<!-- <uni-th align="center">操作</uni-th> -->
			</uni-tr>
			<uni-tr v-for="(item, index) in tableData" :key='index'>
				<uni-td v-for="(item1, index1) in item" :key='index1' align="center">{{ item1.value }}</uni-td>
<!-- 				<uni-td>
					<view style="display: flex;flex-direction: row;">
						<u-button class="uni-button" size="mini" type="primary">修改</u-button>
						<u-button class="uni-button" size="mini" type="error">删除</u-button>
					</view>
				</uni-td> -->
			</uni-tr>
		</uni-table>
	</view>
</template>

<script>
	import {
		selectData
	} from '@/api/database/mysql/index.js'
	export default {
		name: "tableData",
		data() {
			return {
				id: 0,
				dbName: "",
				tableName: "",
				page: 0,
				pageSize: 10,
				tableData: [],
				fieldName: [],
			}
		},
		onLoad(option) {
			this.id = option.id
			this.name = option.name
			this.tableName = option.tableName
		},
		onShow() {
			plus.screen.lockOrientation('landscape-primary');
		},
		onReady() {
			this.doSelectData()
			uni.setNavigationBarColor({
				frontColor: '#000000',
				backgroundColor: uni.getStorageSync('backgroundColor')
			})
		},
		onPullDownRefresh() {
			this.doSelectData()
			uni.stopPullDownRefresh()
		},
		methods: {
			doSelectData() {
				selectData({
					id: this.id,
					name: this.name,
					tableName: this.tableName,
					page: this.page,
					pageSize: this.pageSize
				}).then(res => {
					if (res == null) {
						return
					}
					
					this.fieldName = res.data[0]
					this.tableData = [...this.tableData, ...res.data[1]]
					
					this.page = this.page + 1
				})
			}
		}
	}
</script>

<style scoped>

</style>
